<template>
    <PageWrapper title="截图示例">
      <Row :gutter="24">
        <Col :span="8">
          <Card title="前端">
            <a-button type="primary" @click="handleDeploy(['frontend'])">重新部署</a-button>
          </Card>
        </Col>
        <Col :span="8">
          <Card title="后端">
            <a-button type="primary" @click="handleDeploy(['backend'])">重新部署</a-button>
          </Card>
        </Col>
        <Col :span="8">
          <Card title="前后端">
            <a-button type="primary" @click="handleDeploy(['frontend', 'backend'])">重新部署</a-button>
          </Card>
        </Col>
      </Row>
    </PageWrapper>
  </template>
  <script lang="ts" setup>
    import { PageWrapper } from '@/components/Page';
    import { Card, Col, Row } from 'ant-design-vue';
    import { deploy, DeployParams } from '@/api/deploy';
    import { useMessage } from '@/hooks/web/useMessage';

    const { createMessage } = useMessage();
    const { success } = createMessage;

    async function handleDeploy(endpoints: string[]) {
      const params: DeployParams = {
        endpoints: endpoints,
      }
      await deploy(params);
      success('正在重启，可能需要几分钟')
    }
   
  </script>
  